.sp-filter-bar {
  $self: &;
  background: #fff;
  height: $tabs-height;
  display: flex;
  align-items: center;
  justify-content: center;
  .filter-bar-body {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 1;
  }
  &__ft {
    &:empty {
      padding: 0;
    }
  }
  &__item {
    flex: 1;
    text-align: center;
    height: $tabs-height;
    line-height: $tabs-height;
    &.active {
      .sp-filter-bar__item-text {
        font-weight: bold;
        font-size: 30px;
        color: $color-primary-text;
        position: relative;
        top: -2px;
      }
      .iconfont {
        font-weight: bold;
        color: $color-primary-text;
        position: relative;
        top: -2px;
      }
    }
    &-text {
      color: $color-hint-text ;
      font-size: 28px;
    }
    .iconfont {
      color: $color-hint-text;
      font-size: 24px;
    }
  }
}
